<!DOCTYPE html>
<html dir="ltr" lang="en">

<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <meta content="ie=edge" http-equiv="X-UA-Compatible">
    <link href="CSS/popup.css" rel="stylesheet">
    <link rel="stylesheet" href="/layui/css/layui.css.css">
    <link rel="stylesheet" href="/layer/theme/default/layer.css">
    <script src="JS/jquery-3.4.1.min.js"></script>
    <script src="/layui/layui.js"></script>
    <script src="/layer/layer.js"></script>
    <script src="JS/popup.js"></script>
    <title>__MSG_settings__</title>
</head>

<body>
    <div id="setting_head">
        <h1>__MSG_settings__</h1>
        <a href="#" id="guide">__MSG_detailed_tutorial__</a>
    </div>
    <div id="settingsboxinput">
        <h2>__MSG_images_url__</h2>
        <p>__MSG_images_tips__</p>
        <div id="images">
            <img src="/IMAGES/add.png" alt="add" id="add">
        </div>
        <div id="replacement_mode_div">
            <h2>__MSG_replacement_mode__</h2>
            <span id="replacement_mode">
                <label><input id="order" name="replacement_mode" type="radio" value="order">__MSG_order__</label>
                <label><input id="random" name="replacement_mode" type="radio" value="random"
                        checked>__MSG_random__</label>
            </span>
        </div>
        <h2>__MSG_opacity__</h2>
        <p>__MSG_opacity_tips__</p>
        <input id="setting_opacity" type="text"><br>
        <div id="interval">
            <h2>__MSG_interval_time__</h2>
            <p>__MSG_interval_time_tips__</p>
            <input id="interval_time" type="text">
        </div><br>
        <button class="input_out" id="setting_btn">__MSG_apply__</button>
        <br>
        <button class="input_out" id="default_setting_btn">__MSG_default__</button>
    </div>
</body>

</html>